<template>
    <div>
        <page-main>
            <el-form ref="form" size="mini" :inline="true" :model="form">
                <el-form-item>
                    <el-input
                        v-model="page.username"
                        clearable=""
                        placeholder="请输入用户名/姓名"
                    />
                </el-form-item>
                <el-button
                    type="primary"
                    size="mini"
                    icon="el-icon-search"
                    @click="search"
                >
                    搜索
                </el-button>
                <el-button
                    type="primary"
                    size="mini"
                    icon="el-icon-plus"
                    @click="add"
                >
                    新增
                </el-button>
            </el-form>
            <el-table :data="tableData" border style="width: 100%;">
                <el-table-column
                    align="center"
                    prop="xm"
                    label="姓名"
                    width="180"
                />
                <el-table-column align="center" prop="xh" label="学号" />
                <el-table-column prop="xbmc" align="center" label="性别" />
                <el-table-column label="操作" align="center">
                    <template slot-scope="scope">
                        <el-button
                            type="primary"
                            size="mini"
                            @click="handleEdit(scope.row)"
                        >
                            编辑
                        </el-button>
                        <el-button
                            size="mini"
                            type="default"
                            @click="handleDelete(scope.row)"
                        >
                            删除
                        </el-button>
                    </template>
                </el-table-column>
            </el-table>
            <Page
                :page="page"
                @current-change="currentChange"
                @size-change="sizeChange"
            />
        </page-main>
    </div>
</template>
<script type="text/ecmascript-6">
import Page from '@/components/page'
export default {
    components: {
        Page
    },
    props: {},
    data() {
        return {
            page: {
                pageNo: 1, // 页码
                pageSize: 10, // 每页几条
                totalCount: 0 // 总条数
                // username: ''
            },
            tableData: []
        }
    },
    computed: {},
    watch: {},
    created() {},
    mounted() {
        this.getlist()
    },
    methods: {
        add() {
            this.$router.push({path: 'add'})
        },
        search() {
            this.page.current = 1
            this.getlist()
        },
        getlist() {
            this.$post('backgrounduserinfo/queryUser',  this.page).then(res => {
                if (res.code == 200) {
                    this.tableData = res.body
                    this.page.total = res.data.total
                }
            })
        },
        currentChange(d) {
            this.page.pageNo = d
            this.getlist()
        },
        sizeChange(d) {
            this.page.pageSize = d
        }
    }
}
</script>
